import React,{Component} from 'react'
import {Route,Link} from 'react-router-dom'


export default class Recursive extends Component{
    render(){
        return (
            <div>
                <h1>Recursive</h1>

                <div className="leftNavi">
                    <ul>
                        <li><Link className="active" to={this.props.match.url + '/abc/level1'}>level 1</Link></li>
                        <li><Link className="active" to={this.props.match.url + '/level2'}>level 2</Link></li>
                        <li><Link className="active" to={this.props.match.url + '/abc/level3'}>level 3</Link></li>
                    </ul>
                </div>
                <div className="rightContent">
                    <p>第二个子组件显示内容</p>
                        <Route path={`${this.props.match.url}/:level`} component={Recursive}/>
                </div>


            </div>
        )
    }
}